<!--散点图-->
<div class="player-record-scatter p-m">
    <div class="p-tab p-tab-border">
        <div class="p-tab-h flex-h-mid">
            <ul class="flex-h" id="playerRecordScatterTab">
                <li class="cur" data-type="win"><span>胜率</span></li>
                <li class="" data-type="blood"><span>首血</span></li>
                <li class="" data-type="2"><span>首塔 </span></li>
                <li class="" data-type="3"><span>首龙</span></li>
                <li class="" data-type="4"><span>首大龙 </span></li>
                <li class="" data-type="5"><span>预示者</span></li>
                <li class="" data-type="6"><span>20分钟塔差数</span></li>
                <li class="" data-type="7"><span>20分钟龙数</span></li>
                <li class="" data-type="8"><span>25分钟经济差</span></li>
                <li class="" data-type="9"><span>送掉比赛</span></li>
            </ul>
        </div>
    </div>

    <div class="p-m-c flex-h-space" >

        <div class="scatter-left" id="playerRecordScatter">
            <!--散点图-->
        </div>
        <div class="fail-text hide">数据加载失败 <span>点击重新加载</span></div>
        <div class="scatter-right">
            <div class="numbers flex-h-space">
                <span data-num="10" data-str="804,1004,788,1007,1108,1092,966,1079,1189,1394"  class="cur"><i>10</i>局</span>
                <span data-num="25" data-str="804,1004,788,1007,1108,1092,966,1079,1189,1394,1089,879,1077,-,-,-,-,-,-,-,-,-,-,-,-"><i>25</i>局</span>
                <span data-num="40" data-str="804,1004,788,1007,1108,1092,966,1079,1189,1394,1089,879,1077,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-,-"><i>40</i>局</span>
            </div>
            <ul class="data-li-table">
                <li>
                    <div class="col col-1 flex-h-right"><span class="">胜率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">平均KDA</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-green">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">线上补刀</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">赢线率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">输线率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">carry率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">Troll率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">送头率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">三杀以上率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
                <li>
                    <div class="col col-1 flex-h-right"><span class="">五杀率</span></div>
                    <div class="col col-2 ">
                        <div class="bar flex-h">
                            <span  style="width: 56.2%;"></span>
                        </div>
                    </div>
                    <div class="col col-3 p-arial"><span class="p-red">56.2%</span></div>
                </li>
            </ul>
        </div>
    </div>

</div>